<template>
  <RouterView />
</template>

<script setup>
import { onMounted } from 'vue';
import { RouterView } from 'vue-router'
import { useSettingStore } from '@/stores/useSetting'
import { baseURL } from './config/baseURL';





const settingStore = useSettingStore()
settingStore.getSetting()

onMounted(() => {
  //将网站图标和标题设置到浏览器标签上
  document.title = settingStore.current.logo_name + '  · 管理系统'

  // 删除rel为icon的link标签，解决link一直增加导致favicon不能即时刷新的问题
  document.head.querySelectorAll("link").forEach(link => {
    if (link.rel === 'icon') {
      link.parentNode?.removeChild(link);
    }
  })
  // 修改浏览器页签图标
  const link = document.createElement('link');
  link.rel = "icon";
  link.href = baseURL + settingStore.current.logo

  document.head.append(link);
})

</script>

<style>
html {
  width: 100%;
  height: 100vh;
  overflow: hidden;
}

:root {
  --primary-color: #2d4763;

  --el-color-primary: #2d4763;
  --el-color-primary-light-3: #294d72;
  --el-color-primary-dark-2: #254466;
  --el-color-primary-light-5: #4a698a;
  --el-color-primary-light-6: #6688ad;
  --el-color-primary-light-7: #799fc7;
  --el-color-primary-light-9: #c4e0fd;
  --el-color-primary-light-8: #c5dffc;
}


/* 美化滚动条 */
::-webkit-scrollbar {
  width: 8px;
  height: 10px;
}

::-webkit-scrollbar-thumb {
  background: #e4e4e4;
  border-radius: 5px;
}


.avatar-uploader {
  width: 178px;
  height: 178px;
  background-color: #fff;
  border: 1px dashed #d9d9d9;
  border-radius: 6px;
}

.avatar-uploader .el-upload {
  cursor: pointer;
  position: relative;
  overflow: hidden;
}

.avatar-uploader .el-upload:hover {
  border-color: var(--primary-color);
}

.avatar-uploader-icon {
  font-size: 28px;
  color: #8c939d;
  width: 178px;
  height: 178px;
  line-height: 178px;
  text-align: center;
}

.avatar {
  width: 178px;
  height: 178px;
  display: block;
}

.dialog-footer {
  text-align: end;
  margin-top: 30px;
}
</style>
